<script setup lang="ts">
import {reactive, ref, onMounted} from "vue";
import { SettingOutlined} from '@ant-design/icons-vue';
import {message} from "ant-design-vue";
import type {IListCard} from "@/views/Student/learn/Curriculum/component/data";
import {useListCardData} from "@/views/Student/learn/Curriculum/component/data";
import {setMenu} from "@/config";
import {useRequest} from "vue-hooks-plus/es";
import {postCurriculumGetLearningCurriculum, postModelSelectAllModel} from "@/apis/student";

let listCardData:Array<IListCard> = useListCardData()
const handelClickUse = (query:string):void => {
  message.info(`设置信息${query}`,1)
  setMenu('model')
}
const pagination = reactive<IPageInfo>({
  onChange: (page: number,pageSize):void => {
    if(page && pageSize)
    pagination.pageNum = page
    pagination.pageSize = pageSize
    run()
  },
  pageNum:1,
  pageSize: 10,
  total: 0,
  hideOnSinglePage: true,
  pageSizeOptions:['10', '20', '30', '40']
});
// 获取模型库
let modelDataList = ref<any>([]);

const {
  loading,
  run
} = useRequest(() => postModelSelectAllModel({
  pageNum: pagination.pageNum,
  pageSize: pagination.pageSize
}),{
  manual: true,
  onSuccess: ((res) => {
    console.log(res.data.list)
    modelDataList.value = res.data.list;
    pagination.total = res.data.total
  }),
})
onMounted(() => {
  try {
    run()
  }catch (e) {
    message.error("网络故障")
  }
})
</script>

<template>
  <a-spin :spinning="loading">
    <a-list :grid="{ gutter: 12, column: 5 }" :data-source="modelDataList" :pagination="pagination">
      <template #renderItem="{ item }">
        <a-list-item style="min-width: 15rem;margin-bottom: 0.72rem">
          <a-card hoverable >
            <template #actions >
              <router-link :to="{path:'/use-model',query:{modelId:item.id,modelName:item.modelName}}">
                <a-button type="link" @click="handelClickUse(item.modelName)">
                  <template #icon>
                    <SettingOutlined/>
                  </template>
                  使用
                </a-button>
              </router-link>
            </template>
            <a-card-meta :title="item.modelName" :description="item.modelEnglishName">
            </a-card-meta>
          </a-card>
        </a-list-item>
      </template>
    </a-list>
  </a-spin>
</template>

<style scoped lang="scss">

</style>
